import 'package:flutter/material.dart';

import 'package:get/get.dart';
import 'package:pin_code_fields/pin_code_fields.dart';
import 'package:xmshop/app/services/screenAdapter.dart';
import 'package:xmshop/app/widget/logo.dart';

import '../controllers/code_login_step_two_controller.dart';

class CodeLoginStepTwoView extends GetView<CodeLoginStepTwoController> {
  const CodeLoginStepTwoView({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.white,
        elevation: 0,
        title: const Text('手机号快速登录'),
        centerTitle: true,
      ),
      body: ListView(
        padding: EdgeInsets.all(ScreenAdapter.width(40)),
        children: [
          // logo
          const Logo(),
          Container(
            margin: EdgeInsets.only(top: ScreenAdapter.height(60)),
            padding: EdgeInsets.all(ScreenAdapter.width(40)),
            child: PinCodeTextField(
                autoFocus: true, // 进入就弹出键盘
                keyboardType: TextInputType.number, // 调出数字键盘
                length: 6,
                obscureText: false,
                animationType: AnimationType.fade,
                dialogConfig: DialogConfig(
                    // 汉化Dialog
                    dialogTitle: "黏贴验证码",
                    dialogContent: "确定要黏贴验证码",
                    affirmativeText: "确定",
                    negativeText: "取消"),
                pinTheme: PinTheme(
                    // 样式
                    // 修改边框
                    activeColor: Colors.black12, // 输入文字后边框的颜色
                    selectedColor: Colors.orange, // 选中边框的颜色
                    inactiveColor: Colors.black12, //默认的边框颜色

                    //背景颜色
                    activeFillColor: Colors.white,
                    selectedFillColor: Colors.orange,
                    inactiveFillColor: const Color.fromRGBO(245, 245, 245, 1),
                    shape: PinCodeFieldShape.box,
                    borderRadius: BorderRadius.circular(5),
                    fieldHeight: 50,
                    fieldWidth: 40),
                animationDuration: Duration(milliseconds: 300),
                enableActiveFill: true,
                controller: controller.editingController,
                onCompleted: (v) async {
                  // 隐藏键盘
                  FocusScope.of(context).requestFocus(FocusNode());
                  var result = await controller.doLogin();
                  if (result.success) {
                    // Get.offAllNamed("/tabs", arguments: {"initialPage": 4});
                    Get.back();
                  } else {
                    Get.snackbar("提示信息", result.message);
                  }
                },
                onChanged: (value) {
                  print("输入的内容是：${value}");
                },
                beforeTextPaste: (text) {
                  print("Allowing to paste $text");
                  //if you return true then it will show the paste confirmation dialog. Otherwise if false, then nothing will happen.
                  //but you can show anything you want here, like your pop up saying wrong paste format or etc
                  return true;
                },
                appContext: context // 注意需要传入context
                ),
          ),
          SizedBox(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Obx(() => controller.seconds.value == 0
                    ? TextButton(
                        onPressed: () {
                          controller.sendCode();
                        },
                        child: const Text("重新发送验证码"))
                    : TextButton(
                        onPressed: null,
                        child: Text("${controller.seconds.value}秒后重发送"))),
                TextButton(onPressed: () {}, child: const Text("帮助")),
              ],
            ),
          )
        ],
      ),
    );
  }
}
